<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>商家维护</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link th:href="@{/layui/css/layui.css}" rel="stylesheet" />
    <link th:href="@{/css/plugins/selectpage/selectpage.base.css}" rel="stylesheet" />
    <link th:href="@{/iconfont/iconfont.css}" rel="stylesheet" />
    <link th:href="@{/css/custom.layui.css}" rel="stylesheet" />
    <link th:href="@{/css/style.css}" rel="stylesheet" />
</head>
<body class="eyc-dialog-content">
<form id="inspStationForm" lay-filter="inspStationForm" class="layui-form" autocomplete="off">
    <div class="layui-row layui-col-space30">
        <div class="layui-col-xs12">
            <div class="layui-form-item">
                <label class="layui-form-label">检测站运营公司</label>
                <input class="layui-input eyc-uppercase" name="company" type="text">
            </div>
        </div>
        <div class="layui-col-xs12">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-xs4">
                    <label class="layui-form-label">省</label>
                    <input type="text" id="selectPageProvince" name="province" class="layui-input">
                </div>
                <div class="layui-col-xs4">
                    <label class="layui-form-label">市</label>
                    <input type="text" id="selectPageCity" name="prepecture" class="layui-input">
                </div>
                <div class="layui-col-xs4">
                    <label class="layui-form-label">区</label>
                    <input type="text" id="selectPageCounty" name="county" class="layui-input">
                </div>
            </div>
        </div>
        <div class="layui-col-xs12">
            <div class="layui-form-item">
                <label class="layui-form-label">详细地址</label>
                <input class="layui-input eyc-uppercase" name="addr" type="text">
            </div>
        </div>
        <div class="layui-col-xs6">
            <div class="layui-form-item">
                <label class="layui-form-label">联系人</label>
                <input class="layui-input eyc-uppercase" name="contact" type="text">
            </div>
        </div>
        <div class="layui-col-xs6">
            <div class="layui-form-item">
                <label class="layui-form-label">联系电话</label>
                <input class="layui-input eyc-uppercase" name="contactNum" type="text">
            </div>
        </div>
        <div class="layui-col-xs3">
            <div class="layui-form-item">
                <label class="layui-form-label">检测时长</label>
                <input class="layui-input eyc-uppercase" name="timeConsume" type="text">
            </div>
        </div>
        <div class="layui-col-xs9">
            <div class="layui-form-item">
                <label class="layui-form-label">备注</label>
                <input class="layui-input eyc-uppercase" name="remark" type="text">
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-col-sm12 eyc-text-align-right">
            <button lay-submit="" lay-filter="btnSubmit"
                    class="layui-btn layui-btn-sm layui-btn-primary layui-border-orange">
                <i class="icon iconfont icon-save"></i><span>确定</span>
            </button>
            <button type="button" onclick="closeWin();"
                    class="layui-btn layui-btn-sm layui-btn-primary layui-border-red">
                <i class="icon iconfont icon-close"></i><span>关闭</span>
            </button>
        </div>
    </div>
    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/layui/layui.js}"></script>
    <script th:src="@{/js/plugins/selectpage/selectpage.js}"></script>
    <script th:src="@{/js/genericPage.js}"></script>
    <script>
        let inspStation={};
        let provinceList = [
            {id:'001',name:'上海市'}
        ];
        let cityList = [
            {id:'001',pId:'001',name:'上海市'}
        ];
        let countyList= [
            {id:'001',pId:'001',name:'黄埔区'},
            {id:'002',pId:'001',name:'徐汇区'},
            {id:'003',pId:'001',name:'长宁区'},
            {id:'004',pId:'001',name:'静安区'},
            {id:'005',pId:'001',name:'普陀区'},
            {id:'006',pId:'001',name:'虹口区'},
            {id:'007',pId:'001',name:'杨浦区'},
            {id:'008',pId:'001',name:'闵行区'},
            {id:'009',pId:'001',name:'宝山区'},
            {id:'010',pId:'001',name:'嘉定区'},
            {id:'011',pId:'001',name:'浦东新区'},
            {id:'012',pId:'001',name:'金山区'},
            {id:'013',pId:'001',name:'松江区'},
            {id:'014',pId:'001',name:'青浦区'},
            {id:'015',pId:'001',name:'奉贤区'},
            {id:'016',pId:'001',name:'崇明区'}
        ];
        let initCity=function(id){
            var arr = new Array();
            $.each(cityList, function(i,row){
                if(row.pId === id) arr.push(row);
            });
            //从城市数据中过滤省份是选择的省，并刷新城市的选择器数据
            if(arr.length) $('#selectPageCity').selectPageData(arr);
        };
        let initCounty=function(id){
            let arr = new Array();
            $.each(countyList, function(i,row){
                if(row.pId === id) arr.push(row);
            });
            //从城市数据中过滤省份是选择的省，并刷新城市的选择器数据
            if(arr.length) $('#selectPageCounty').selectPageData(arr);
        };
        let submitForm=function(){
            let data = eyc.ui.getValueUiElement($("form"));
            $.extend(inspStation, data);
            eyc.ajax.promise('/eyc/insertOrUpdateInspStation',inspStation).then(res=>{
                if(res.data){
                    parent.layer.msg('保存成功~~');
                    parent.contabs.getActivePageWin().refreshData();
                    closeWin();
                }
            });
        };
        $(function() {
            layui.use([ 'form'], function () {
                var form = layui.form;
                form.on('submit(inspStationForm)', function() {
                    submitForm();
                    return false;
                });
            });

            //省份选择器初始化
            $('#selectPageProvince').selectPage({
                showField: 'name',
                keyField: 'name',
                data: provinceList,
                eSelect: function (data) {
                    if(data){
                       initCity(data.id);
                    }
                },
                eClear: function(){//清空时，同时清空城市内容
                    $('#selectPageCity').selectPageClear();
                    $('#selectPageCity').selectPageData([]);
                    $('#selectPageCounty').selectPageClear();
                    $('#selectPageCounty').selectPageData([]);
                }
            });
//城市选择器的初始化，使用空数据进行初始化
            $('#selectPageCity').selectPage({
                showField: 'name',
                keyField: 'name',
                data: [],
                eSelect: function (data) {
                    if(data){
                        initCounty(data.id);
                    }
                },
                eClear: function(){//清空时，同时清空城市内容
                    $('#selectPageCounty').selectPageClear();
                    $('#selectPageCounty').selectPageData([]);
                }
            });
            $('#selectPageCounty').selectPage({
                showField: 'name',
                keyField: 'name',
                data: []
            });

        });
        let initData=function (rowData) {
            let getParentId=function (name,datas) {
                let id=null;
                datas.forEach(function (row) {
                    if(row.name===name){
                        id=row.id;
                    }
                });
                return id;
            };
            this.inspStation=rowData;
            initCity(getParentId(rowData.province,provinceList));
            initCounty(getParentId(rowData.prepecture,cityList));
            eyc.ui.setValueUiElement($('#inspStationForm'),this.inspStation);
            $('#selectPageProvince').selectPageRefresh();
            $('#selectPageCity').selectPageRefresh(rowData.prepecture);
            $('#selectPageCounty').selectPageRefresh(rowData.county);
        };

        // 关闭
        let closeWin=function () {
            let index = parent.layer.getFrameIndex(window.name); // 获取当前窗体索引
            parent.layer.close(index); // 执行关闭
        };
        window.initData=initData;
    </script>
</form>
</body>